<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>欢迎登录</title>
<script src="https://hcb98.gitee.io/test_pages/jquery-1.8.1.js"></script>
<script type="text/javascript"> 
$(document).ready(function(){
$(".flip").click(function(){
    $(".panel").slideToggle("slow");
  });
});
</script>
<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css">  
<script src="https://cdn.bootcss.com/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
 
<style type="text/css"> 
div.panel,p.flip
{
font-size:20px;
margin:0px;
padding:5px;
text-align:center;
background:#e5eecc;
border:solid 1px #c3c3c3;
}
div.panel
{
height:400px;
display:none;
}

</style>
</head>
<body>
    <p class="flip" style="color:red">Welcome To My Index</p>
<div class="panel"><table class="table table-bordered">
    <caption>边框表格布局</caption>
    <thead>
      <tr>
        <th>username</th>
        <th>password</th>
        <th>number</th>
        <th>email</th>
        <th>regist time</th>
      </tr>
    </thead>
    <tbody>
      <tr class="active">
        <td id="name"></td>
        <td id="pwd"></td>
        <td id="num"></td>
        <td id="email"></td>
        <td id="time"></td>
      </tr>
      
    </tbody>
  </table>
  <script>
    var nameInput=localStorage.getItem("Name");
  
    document.getElementById('name').innerHTML = nameInput
  
    var pwdInput=localStorage.getItem("Password");
  
    document.getElementById('pwd').innerHTML = pwdInput
  
    var numInput=localStorage.getItem("Number");
  
    document.getElementById('num').innerHTML = numInput
  
    var emailInput=localStorage.getItem("Email");
  
    document.getElementById('email').innerHTML = emailInput
  
    var timeInput=localStorage.getItem("Time");
  
    document.getElementById('time').innerHTML = timeInput
  </script>


<input id="number" name='gj' placeholder="请输入手机号">
<div id="myDiv">

<div class="div3">

<button>查询</button>
<script type="text/javascript">
$("button").on("click", function(){
  var param0 = $("input[name='gj']").val();
  console.log(1)
  $.ajax ({
        url:"http://api04.aliyun.venuscn.com/mobile",
         data: {
          mobile:param0
         },
         type:"GET",
         beforeSend: function(req) {
           req.setRequestHeader("Authorization", "APPCODE 3db6434668ad4961891a2d78531ac945")
         },
         success: function (data) {
           console.log(data)
           $(".div3").text(data.data.types+data.data.prov+data.data.city)
         },
         error: function (data) {
           console.log(data);
         }
  });
});
</script>
</div>
</div>
</body>